<%@ page language= "java" %>
<%@ page import = "beans.*" %> 
<%@page contentType="text/html; charset=UTF-8" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<jsp:useBean id="jb" scope="application" class="beans.HeatMapSearchBean" />
	<jsp:useBean id="ab" scope="application" class="beans.AutoCompleterBean" />
	<%
	
	
	String activity = request.getParameter("activity");
	String city = request.getParameter("state_input_city");
	String state = request.getParameter("state_input_name");
	String countryName = request.getParameter("state_input_country");
	if(state == null && countryName != null ) {
		state = ab.getCountryLabel(countryName);
	}
	if(state != null && countryName == null ) {
		countryName = ab.getCountryName(state);
	}
	
	
	
	
	
	
	
	HMConfig hmc = jb.search(city,state,activity);
	/*
	if(hmc == null) {
		response.sendRedirect("index.jsp");
		return;
	}
	*/
	%>
	
	<title>My Sport Pals</title>
	<script type="text/javascript">
	var zoom = 11;
	
	<% if(hmc != null) { %>
	
	var activity = "<%= activity %>";
	var city = "<%= city %>";
	var countryName = "<%= countryName %>";
	
	var north = <%= hmc.getNorth()%>;
	var south = <%= hmc.getSouth()%>;
	var east = <%= hmc.getEast()%>;
	var west = <%= hmc.getWest()%>;
	var dir = "imgs/<%= hmc.getDir()%>/";
	var population = <%= hmc.getPopulation()%>;
	
	var n_users = [];
	var n_tracks = [];
	n_users[0] = <%= hmc.getNusers(0)%>;
	n_users[1] = <%= hmc.getNusers(1)%>;
	n_users[2] = <%= hmc.getNusers(2)%>;
	n_users[3] = <%= hmc.getNusers(3)%>;
	
	n_tracks[0] = <%= hmc.getNtracks(0)%>;
	n_tracks[1] = <%= hmc.getNtracks(1)%>;
	n_tracks[2] = <%= hmc.getNtracks(2)%>;
	n_tracks[3] = <%= hmc.getNtracks(3)%>;
	
	<% } %>
	
	</script>
	
	<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
	
	<script type="text/javascript" src="js/test.js"></script>
	<script type="text/javascript" src="js/prototype.js"></script>
	<script type="text/javascript" src="js/slider.js"></script>
	<script type="text/javascript" src="js/scriptaculous.js"></script>
	<script type="text/javascript" src="js/ProjectedOverlay.js"></script>
	<script src="js/auto.js" type="text/javascript"></script>
	
	<link href="css/map.css" rel="stylesheet" type="text/css">
	<link rel="stylesheet" type="text/css" href="css/auto.css">
	
	
	<script type="text/javascript">
	var _gaq = _gaq || [];
	_gaq.push(['_setAccount', 'UA-22732370-1']);
	_gaq.push(['_trackPageview']);
	(function() {
	var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
	ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
	var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
	})();
	</script>
	
	
	
	</head>
	
	<body onload="init()">
	
	<h1>My Sport Pals</h1>
	
	
	
	<form action="" method="get">
	<table>
	<tr>
	<div id="activ_buttons" align="right">
	<td colspan="2" align="right">
	<h3>
	
	
	<img src="icons/cycling.png" /><input type="radio" name="activity" value="Cycling" <% if(activity.equalsIgnoreCase("Cycling")) out.print("checked"); %>>Cycling
	<img src="icons/running.png" /><input type="radio" name="activity" value="Running" <% if(activity.equalsIgnoreCase("Running")) out.print("checked"); %>>Running
	<img src="icons/walking.png" /><input type="radio" name="activity" value="Walking" <% if(activity.equalsIgnoreCase("Walking")) out.print("checked"); %>>Walking
	</h3>
	</td>
	</div>
	</tr>
	<tr>
	<td><h2>City:</h2>
	</td>
	<td>
	<input type="text" name="state_input_city" id="state_input_city" size="20" value="<%= city %>" />
	<div id="suggestions_city"></div>
	</td>
	
	<td><h2>Country:</h2>
	</td>
	<td>
	<input type="text" name="state_input_country" id="state_input_country" size="20" value="<%= countryName %>" />
	<div id="suggestions_country"></div>
	</td>
	</tr>
	<tr><td colspan="2" align="right"><input type ="submit" id="button" value="search"></td></tr>
	</table>
	
	</form> 
	
	
	<% if(hmc != null) { %>
	
	<div id="trackarea">
	<div id="track"><div id="handle"></div></div>
	</div>
	
	<div>
	Time: <input id="hour" type="text" onchange="enterTime()">
	</div>
	
	<div>
	<input id="run" type="button" onclick="run()" value="start">
	</div>
	
	
	<div id="map">
	</div>
	
	<div id="userstracks"></div>
	<p>Population: <%= hmc.getPopulation()%></p>
	
	<% } %>
	
	<h1>No data available</h1>
	<a href="index.jsp"><h2>back</h2></a>
	
	
	</body>
</html>